<!doctype html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>		
	<link rel="stylesheet" type="text/css" href="css/jquery-ui-1.7.1.custom.css" />
	<link rel="stylesheet" href="css/twitter-client.css" type="text/css" media="screen" />	
  	<script type='text/javascript' src='twitter/dwr/interface/TwitterService.js'></script>
  	<script type='text/javascript' src='twitter/dwr/interface/TinyUrlService.js'></script>
  	<script type='text/javascript' src='twitter/dwr/engine.js'></script>
  	 <script type='text/javascript' src='twitter/dwr/util.js'></script>
	<script type="text/javascript" src="jquery/js/jquery-1.3.2.js"></script>
	<script type="text/javascript" src="jquery/js/jquery-ui-1.7.1.custom.min.js"></script>
	<script type="text/javascript" src="jquery/js/jquery.dimensions.js"></script>	
	<script type="text/javascript" src="js/twitter-client.js"></script>		

</head> 
<body>
<% 
	request.getSession().setAttribute("twitterUser","kasparminosiant");
	request.getSession().setAttribute("confluenceUser","kaspar");
%>
<div id="twitter-ui">
	<div id="twitter-aouth" class="hidden-el">
		<div class="hidden-el twitter-sign-in-button twitter-sign-in" ></div>
		<form action=""  name="oauthPin" id="oauth-pin-form" class="hidden-el">
			<label>&nbsp;</label>
			<input name="oauthPin" class="ui-widget-content ui-corner-all" type="text" />    				
    		<button class="ui-state-default ui-corner-all ui-button"> submit PIN</button>    			
		</form>		
		<div class="hidden twitter-sign-in-button complete"></div>
	</div>
	<div id="twitter-client" class="hidden-el">
	<table cellpadding="0" cellspacing="0" border="0" class="ui-widget">
		<tr> <!-- twitter logo, refresh --> 
			<td>
				 <ul id="twitter-head-bar">
    				<li><a class="url" href="http://twitter.com/">twitter</a></li>
    				<li class="refresh-button">refresh</li>
    				<li class="url">powered by tweet2it</li>
    				<li class="url">logout</li>
  				</ul>			
			</td>  
		</tr>
		<tr> <!-- me profile info list -->
			<td>
			  	<ul id="twitter-profile-bar">
    				<li class="profile me"></li>
    				<li class="profile followers"></li>
    				<li class="profile following"></li>
  				</ul>			
			</td>
		</tr>
		<tr>
			<td>
				<form action=""  name="tinyUrl" id="tiny-url-form">
					<label>&nbsp;</label>
					<input name="urlToTransform" class="ui-widget-content ui-corner-all normal-url" type="text" />    				
    				<button class="ui-state-default ui-corner-all make-tiny ui-button"> make tiny</button>    			
				</form>
			</td>
		</tr>
		<tr> <!-- textarea -->
			<td>
				<div id="twitter-status" class="ui-widget-content ui-corner-all" >								
					<textarea class="status-textarea"></textarea>								 
					<!-- status-menu-bar -->
					<div id="twitter-status-menu-bar" >
		    			<div class="status-menu-item counter">140</div>
		    			<div class="status-menu-item clear-button ">clear</div>	    			
		    			<div class="status-menu-item submit-button"><button id="create-status" class="ui-button ui-state-default ui-corner-all submit-button"> submit</button></div>
		  			</div>															
	  			</div>
			</td>
		</tr>		
		
		<tr> <!-- twitter menu -->
			<td>
			<div id="tabs">
				<ul>
					<li><a href="#tabs-home">Home</a></li>
					<li><a href="#tabs-my">My</a></li>
					<li><a href="#tabs-replies">Rep</a></li>
					<li><a href="#tabs-direct">Direct</a></li>
					<li><a href="#tabs-favorite">Fav</a></li>
					<li><a href="#tabs-everyone">All</a></li>
				</ul>
				<div id="tabs-home"></div>
				<div id="tabs-my"></div>
				<div id="tabs-replies"></div>
				<div id="tabs-direct"></div>
				<div id="tabs-favorite"></div>
				<div id="tabs-everyone"></div>
			</div> 
			<button id="more-statuses" class="ui-button ui-state-default ui-corner-all"> more</button> 							
			</td>
		</tr>					
	</table>

<div class="popup effect ui-widget-content ui-corner-all" id="profile-data">
	<div class="popup-data">
	<img width="80" height="80" border="1" valign="middle" src="img/me.jpg" id="profile-image" alt=""/>	
	<ul>
		<li class="name"><strong>Name: </strong></li>
		<li class="location"><strong>Location:</strong></li>
		<li class="web"><a href="#"></a></li>
		<li class="following"><a href="">Following</a></li>					
		<li class="followers"><a href="">Followers</a></span></li>
	</ul>
	<div class="clear"></div>	
	<p class="bio">Bio</p>
	
	</div>
</div>
<div class="popup effect ui-widget-content ui-corner-all" id="powered-by" style="margin:0">				
					
	<div class="popup-data">
		<a href="#" class="right">close</a>
		<span class="hh1">tweet<span>2</span>it</span>
		<a href="http://tweet2it.minosiants.com">http://tweet2it.minosiants.com</a>
		<p><strong>tweet2it</strong> is <a href="http://www.atlassian.com/software/confluence/">Confluence</a> plugin for <a href="http://twitter.com/">twitter</a> </p>
	</div>	
</div>	     
</div>
</div>			
</body>
</html>